import { markRaw } from 'vue'
//菜单工具模块, 配合 MenuView.vue 组件 动态展示菜单设置项对应的组件
function createMenu(menuArr, enableHash=false) {
    //menuArr中对象结构{path,name,component,menuShow,icon}
    if(menuArr.length < 1) {
        throw new Error('至少要有一个菜单项配置');
    }
    //核心对象
    const menuCore = {
        currentPath: menuArr[0].path, 
        currentComponent: undefined,
        menuObj: undefined,
        menuShow: true,
        history: [], //历史path
        push: (path)=>{},
        back: (step=1)=>{},
        enableHash: enableHash,//启用地址hash
    };

    const menuObj = {};//菜单合集
    for(let me of menuArr) {
        me.component = markRaw(me.component);
        menuObj[me.path] = me;
    }
    menuCore.menuObj = menuObj;

    menuCore.push = function (path) {
        const me = this.menuObj[path];
        if(me) {
            this.currentComponent = me.component;
            if(!this.enableHash) {//让浏览器存储历史
                this.history.push(path);
            }
            this.currentPath = me.path;
            this.menuShow = me.menuShow;
            if(this.enableHash) {
                this.changeWindowHash(path);
            }
            return;
        }
        console.warn(`path[${path}]没有对应的菜单项`);
    }

    menuCore.back = function (step=0) {
        if(this.enableHash) {
            this.goBackWithHash(step);
        } else {
            this.goBackNoHash(step);
        }
    }

    menuCore.goBackWithHash = function (step=1) {//浏览器goback
        if(!step) {
            step = 1;
        }
        if(step > 0) {
            step*=-1;
        }
        window.history.go(step);
    }
    menuCore.goBackNoHash = function (step=0) {//自实现goback
        if(step === undefined || step === null || step.constructor.name !== 'Number') {
            step = 1;
        }
        let len = this.history.length;
        if(len <= 1) {
            console.warn('没有更多的历史记录');
            return false;
        }
        if(step > len) {
            step = len;
        }
        //移除历史
        for(let i=0; i< step; i++) {
            this.history.pop();
        }
        let path = this.history[this.history.length-1];
        if(path) {
            const me = this.menuObj[path];
            this.currentComponent = me.component;
            this.currentPath = path;
            this.menuShow = me.menuShow;
            if(this.enableHash) {
                this.changeWindowHash(path);
            }
        }
        return true;
    }

    menuCore.changeWindowHash = function (path) {
        if(window && window.location) {
            window.location.hash = '#'+path;
        }
    }
    menuCore.getWindowHash = function () {
        if(window && window.location) {
            return window.location.hash;
        }
    }

    //在使用处的 onMounted 内调用
    menuCore.watchHashChange = function () {
        window.onhashchange = () => {// 监听浏览器的回退/前进
            let hash = window.location.hash;
            const path = hash.replace('#', '');
            // console.log('onhashchange==> hash=', hash, ',path=', path, ',currentPath=', this.currentPath);
            if(this.currentPath != path) {
                this.push(path);
                // console.log('hashchange menuCore:', this);
            }
        }
    }

    //处理地址hash    
    if(menuCore.enableHash) {
        const hash = menuCore.getWindowHash();
        if(hash.startsWith('#/')) {
            const path = hash.replace('#', '');
            if(menuCore.menuObj[path]) {
                menuCore.currentPath = path;
            }
        }
        // menuCore.watchHashChange();
    }
    //默认激活的菜单
    menuCore.push(menuCore.currentPath);

    return menuCore;
}

export const createMenuCore = createMenu;
